


.btns_sprite{
    background-image: url("../img/toBtn.png") ;
    background-size: rem(448) rem(1224);
}
.s_egg_item_sprite{
    background-image: url("../img/s_egg_sprites.png") ;
    background-size: rem(556) rem(153);
}
.b_egg_item_sprite{
    background-image: url("../img/b_egg_sprites.png") ;
    background-size: rem(548) rem(3660);
}
.egg_item_info_sprite{
    background-image: url("../img/dialog.png") ;
    background-size: rem(560) rem(420);
}

// 获取奖品按钮
.get_reward_btn{
    @extend .btns_sprite;
    height: rem(90);
    width: rem(360);

    // 填写收货地址
    &[type="writeAdress"]{
        background-position: rem(-7) rem(-619);

        &:active{
            background-position: rem(-7) rem(-721);
        }
        &_active{
            background-position: rem(-7) rem(-721);
        }
    }

    // 领Q币
    &[type="getQB"]{

        background-position: rem(-7) rem(-925);

        &:active{
            background-position: rem(-7) rem(-1027);
        }
        &_active{
            background-position: rem(-7) rem(-1027);
        }
    }

    // 填写收货地址和领Q币
    &[type="getQBAndChangeAdress"]{

        background-position: rem(-4) rem(-823);
        width: rem(440);

        &:active{
            background-position: rem(-5) rem(-1129);
        }
        &_active{
            background-position: rem(-5) rem(-1129);
        }

    }
}

// 小蛋
.s_egg_item{
    height: rem(143);
    width: rem(131);
    @extend .s_egg_item_sprite;
    background-position-y: rem(-5);

    &[type="blue"]{
        background-position-x:rem(-4) ;
    }
    &[type="yellow"]{
        background-position-x:rem(-422) ;
    }
    &[type="red"]{
        background-position-x:rem(-282) ;
    }
    &[type="green"]{
        background-position-x:rem(-143) ;
    }

}

// 大的蛋
.b_egg_item{

    @extend .b_egg_item_sprite;

    &.top_item{
        height: rem(371);
        width: rem(540);
        background-position: rem(-3) rem(-4);
    }
    &.mid_item{
        height: rem(175);
        width: rem(540);
    }
    &.bottom_item{
        height: rem(315);
        width: rem(540);
    }

    &[type="blue"]{
        
        &.mid_item{
            background-position: rem(-5) rem(-1204);
        }
        &.bottom_item{
            background-position: rem(-4) rem(-1701);
        }
    }
    &[type="yellow"]{
        
        &.mid_item{
            background-position: rem(-5) rem(-2844);
        }
        &.bottom_item{
            background-position: rem(-4) rem(-3341);
        }
    }
    &[type="red"]{
        
        &.mid_item{
            background-position: rem(-5) rem(-2432);
        }
        &.bottom_item{
            background-position: rem(-4) rem(-2111);
        }
    }
    &[type="green"]{
        
        &.mid_item{
            background-position: rem(-5) rem(-794);
        }
        &.bottom_item{
            background-position: rem(-4) rem(-471);
        }
    }

}

// 大的蛋的纸
.egg_item_info{

    &_paper{
        @extend .egg_item_info_sprite;
        display: flex;
        flex-direction:column;
        justify-content: space-between;
        align-items: center;
        height: rem(412);
        width: rem(430);
        background-position: rem(-29) rem(-4);
        padding: rem(144) rem(40) rem(40) rem(40);
        text-align: center;
        box-sizing: border-box;

        .egg_item_reward_type{
            color: #ED2809;
            font-size: rem(32);
            line-height: rem(50);
            text-overflow: -o-ellipsis-lastline;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            line-clamp: 2;
            -webkit-box-orient: vertical;
        }

        .egg_item_reward_tip{
            color: #8D8271;
            font-size: rem(28);
            line-height: rem(38);
            text-overflow: -o-ellipsis-lastline;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            line-clamp: 2;
            -webkit-box-orient: vertical;
            &:before{
                content:"";
                display: inline-block;
                @extend .egg_item_info_sprite;
                background-position: rem(-491) rem(-281);
                height: rem(23);
                width: rem(24);
                margin-right: rem(10);
            }
        }
    }
    &_close{
        position: fixed;
        top: rem(160);
        right: rem(80);
        @extend .egg_item_info_sprite;
        height: rem(64);
        width: rem(64);
        background-position: rem(-492) rem(-4);
        z-index: 2;
        
    }
}

// 星星
.bbling{

    position: absolute;
    top: 0;
    @extend .egg_item_info_sprite;

    // 小星星
    &_bstar{
        width: rem(51);
        height: rem(51);
        background-position: rem(-493) rem(-138);
    }
    &_sstar{
        width: rem(23);
        height: rem(24);
        background-position: rem(-530) rem(-243);
    }

    // 空心圈
    &_bemptyhole{
        width: rem(53);
        height: rem(53);
        background-position: rem(-493) rem(-77);
    }
    &_semptyhole{
        width: rem(37);
        height: rem(37);
        background-position: rem(-493) rem(-198);
    }

    // 黄色圈
    &_byellowhole{
        width: rem(29);
        height: rem(28);
        background-position: rem(-492) rem(-243);
    }
    &_syellowhole{
        width: rem(16);
        height: rem(17);
        background-position: rem(-525) rem(-282);
    }

    // 红色圈
    &_redhole{
        width: rem(16);
        height: rem(17);
        background-position: rem(-492) rem(-313);
    }
    // 蓝色圈
    &_bluehole{
        width: rem(17);
        height: rem(16);
        background-position: rem(-537) rem(-197);
    }


}
